<style>
    .layui-table-page{
        text-align: right;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">
            <span><?= $navName ?></span>
            <span style="float:right;">
                <a href="javascript:;" onclick="return add(<?= $order_id ?>,<?= $type_id ?>)" class="layui-btn layui-btn-sm customize">新增<?= $type_id == 1 ? "应收" : "应付" ?></a>
            </span>
        </div>
        <div class="layui-card-body">
            <table class="layui-hide" id="table-data" lay-filter="table-data" style="overflow-x:scroll;"></table>
            <tool id="table-toolbar" style="display:none">
                <div class="layui-btn-container">
                    <?php if ($type_id == 1) { ?>
                        <button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="batchYingshou">
                            收款
                        </button>
                    <?php } ?>
                    <?php if ($type_id == 2) { ?>
                        <button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="batchYingfu">
                            付款
                        </button>
                    <?php } ?>
                </div>
            </tool>
        </div>
    </div>
</div>
<script>
    var addUrl = "<?= $this->projectSet["url"]["add"] ?>";
    var editUrl = "<?= $this->projectSet["url"]["edit"] ?>";
    var doDelUrl = "<?= $this->projectSet["url"]["doDel"] ?>";
    var batchPayUrl = "<?= $this->projectSet["url"]["batchPay"] ?>";
    var doSelectIdsUrl = "<?= $this->projectSet["url"]["doSelectIds"] ?>";
    var type_id = "<?= $type_id ?>";
</script>
<script>
    layui.use(['laypage', 'layer', 'form', 'laydate', 'table'], function () {
    var laypage = layui.laypage,
            frm = layui.form,
            laydate = layui.laydate,
            layer = layui.layer,
            table = layui.table;
            //var tableObj = table.render({});
            var cookiePageArray = [];
            //存储已选择数据集，用普通变量存储也行，就是一个缓存变量
            layui.data('checkedV', null);
            table.render({
            elem: '#table-data'
                    , url: '<?= $base_url ?>'
                    , toolbar: '#table-toolbar'
//            , defaultToolbar: ['filter', {
//                    title: '导出所有搜索结果' //标题
//                    , layEvent: 'export_all' //事件名，用于 toolbar 事件中使用
//                    , icon: 'layui-icon-export' //图标类名
//                }]
                    , defaultToolbar: ['filter']
                    , title: '<?= $navName ?>'
                    , size: 'sm'
                    , cellMinWidth: 80
                    , height: 350
                    , cols: [[
                    {type: 'checkbox', fixed: 'left', LAY_CHECKED: false}
                    , {field: 'cmp_bf', title: '供应商'}
                    , {field: 'fee_type_name', title: '费用类型'}
                    , {field: 'unit_name', title: '计费方式'}
                    , {field: 'unit_fee', title: '单价', width: 90}
                    , {field: 'num', title: '数量'}
                    , {field: 'total_fee', title: '总价'}
<?php if ($type_id == 2) { ?>
                        , {field: 'start_mileage', title: '开始公里数', width: 100}
                        , {field: 'end_mileage', title: '结束公里数', width: 100}
                        , {field: 'transport_type_tag', title: '运输类型'}
<?php } ?>
                    , {field: 'remark', title: '备注'}
                    , {field: 'pay_status_tag', title: '收付状态'}
                    , {field: 'pay_shouzhi_bank_title', title: '收付账户', width: 100}
                    , {field: 'pay_time_tag', title: '收付日期', width: 110}
                    , {field: 'created_at_alias', title: '添加日期', width: 150}
                    , {
                    fixed: 'right', title: '操作', width: 120,
                            templet: function (d) {
                            var html = '';
                                    html += "<a href='javascript:;' onclick='return edit(" + d.id + "," + type_id + ")' class='layui-btn layui-btn-normal layui-btn-xs'>编辑</a>";
                                    html += "<a href='javascript:;' onclick='return del(" + d.id + ")' class='layui-btn layui-btn-danger layui-btn-xs'>删除</a>";
                                    return html;
                            }
                    }
                    ]
                    ]
                    , done: function (res, curr, count) {
                    //.假设你的表格指定的 id="sale-data"，找到框架渲染的表格
                    var tbl = $('#table-data').next('.layui-table-view');
                            //记下当前页数据，Ajax 请求的数据集，对应你后端返回的数据字段
                            cookiePageArray = res.data;
                            //记录当前也选中的chechbox个数(判断全选使用的)
                            var len = 0;
                            //遍历当前页数据，对比已选中项中的 id
                            for (var index = 0; index < cookiePageArray.length; index++) {
                    //console.log(cookiePageArray);
                    if (layui.data('checkedV', cookiePageArray[index]['id'])) {
                    //逐个判断是否选中，如果已经选中就改变选中模式
                    var i = cookiePageArray[index]['LAY_TABLE_INDEX'];
                            //console.log(i);
                            var checkbox = $('.layui-table tr[data-index=' + i + '] input[type="checkbox"]');
                            checkbox.prop('checked', true);
                            checkbox.next().addClass('layui-form-checked');
                            //checkbox.parent().parent().parent().addClass('layui-table-click');
                            //res.data[i].LAY_CHECKED = true;
                            //为了设置全选的
                            len++;
                    }
                    }

                    //console.log(this.limit + "=====" + len);
                    //设置全选checkbox的选中状态，只有改变LAY_CHECKED的值， table.checkStatus才能抓取到选中的状态
                    if (len === this.limit) {
                    var checkboxAll = $('.layui-table-header th[data-field=0] input[type="checkbox"]');
                            checkboxAll.prop('checked', true);
                            checkboxAll.next().addClass('layui-form-checked');
                            //checkboxAll.parent().parent().parent().addClass('layui-table-click');
                    }
                    //暂时只能这样渲染表单
                    frm.render('checkbox');
                    }
            });
            //头工具栏事件
            table.on('toolbar(table-data)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
                    var selectData = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
                    switch (obj.event) {
            case 'batchYingshou':
                    var length = selectData.length;
                    if (length <= 0) {
            layer.msg('请选择订单');
                    return false;
            }
            batchPay(1);
                    break;
                    case 'batchYingfu':
                    var length = selectData.length;
                    if (length <= 0) {
            layer.msg('请选择订单');
                    return false;
            }
            batchPay(2);
                    break;
            }
            });
            table.on('checkbox(table-data)', function (obj) {
            //console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
            //全选或单选数据集不一样
            var data = 'one' === obj.type ? [obj.data] : cookiePageArray;
                    var selectData = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
                    //遍历数据
                    $.each(data, function (index, item) {
                    //假设你数据中 id 是唯一关键字
                    if (obj.checked) {
                    //alert(obj.tr);
                    //console.log(obj.tr);
                    //.增加已选中项
                    layui.data('checkedV', {
                    key: item.id, value: item
                    });
                            if (selectData.indexOf(item.id) > - 1) {//如果原来的键值存在,则不操作

                    } else {
                    selectData.push(item.id);
                    }
                    //obj.tr.addClass('layui-table-click');
                    } else {
                    //alert(0);
                    //console.log(0);
                    //.删除
                    layui.data('checkedV', {
                    key: item.id, remove: true
                    });
                            selectData.splice(selectData.indexOf(item.id), 1);
                            //obj.tr.removeClass('layui-table-click');
                    }
                    layui.data('checkedV', {
                    key: "select_data", value: selectData
                    });
                    });
                    var ids = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
                    $.ajax({
                    type: "POST",
                            dataType: "json",
                            url: doSelectIdsUrl,
                            data: {
                            ids: ids
                            },
                            success: function (data) {
                            }
                    });
                    //console.log(layui.data('checkedV'));
            });
    });</script>
<script src="<?= PUBLIC_URL . "/" . $this->projectSet["file"]["js"] . "/view.js?" . rand() ?>"></script>

